oa.view.rf.inverseOperation = {
/**
 * Render the structure of an inverseOperation problem
 * 
 * @author Gerd Wagner
 * @param {ArithmeticProblem} ap  An arithmetic problem.
 */
render: function (ap) {
  var el = {};
  var rB = document.getElementById("renderBox");
  var mainEl = dom.createDiv("inverseOperation");
  var opEl = dom.createDiv("op"),
      opEq1El = dom.createDiv("","eq1"),
      opEq2El = dom.createDiv("","eq2");
  var invOpEl = dom.createDiv("invOp"),
      invOpEq1El = dom.createDiv("","eq1"),
      invOpEq2El = dom.createDiv("","eq2");
  opEl.appendChild( opEq1El);
  opEl.appendChild( opEq2El);
  mainEl.appendChild( opEl);
  invOpEl.appendChild( invOpEq1El);
  invOpEl.appendChild( invOpEq2El);
  mainEl.appendChild( invOpEl);
  rB.appendChild( mainEl);
  // plus/times equation 1
  oa.view.rf.inverseOperation.setUpBinaryTermEquationStructure( opEq1El, ap.type.operators[0]);
  // plus/times equation 2
  oa.view.rf.inverseOperation.setUpBinaryTermEquationStructure( opEq2El, ap.type.operators[0]);
  // minus/dividedBy equation 1
  oa.view.rf.inverseOperation.setUpBinaryTermEquationStructure( invOpEq1El, ap.type.operators[0]+1);
  // minus/dividedBy equation 2
  oa.view.rf.inverseOperation.setUpBinaryTermEquationStructure( invOpEq2El, ap.type.operators[0]+1);
  // configure the submit/continue button
  el = dom.createButton("submitButton","blue","?");
  mainEl.appendChild( el);
  el.addEventListener("click", oa.view.rf.inverseOperation.handleClickSubmitButtonEvents, false);
  document.addEventListener("keypress", oa.view.handleKeyPressEvents, true);
},
/**
 * Set up the term equation rendering structure
 * 
 * @author Gerd Wagner
 * @param {object} parentEl  The parent element object.
 * @param {number} operator  An integer between 1 and 4 representing an arithmetic operator.
 */
setUpBinaryTermEquationStructure: function ( parentEl, operator) {
  var el = dom.createSpan("","operand1");
  parentEl.appendChild( el);
  el = dom.createSpan("","operator");
  el.innerHTML = oa.view.operatorSymbols[ operator-1];
  parentEl.appendChild( el);
  el = dom.createSpan("","operand2");
  parentEl.appendChild( el);
  el = dom.createSpan("","equalitySymbol");
  el.innerHTML = "=";
  parentEl.appendChild( el);
  el = dom.createNumInput("","askedFor");
  el.addEventListener("input", oa.view.handleUserInputEvents, false);
  parentEl.appendChild( el);
},
  /**
 * Fill the rendering structure with new values
 * 
 * @author Gerd Wagner
 * @param {ArithmeticProblem} ap  An arithmetic problem.
 */
fill: function (ap) {
  var askedForElements = document.getElementsByClassName("askedFor");
  for (var i=0; i < askedForElements.length; i++) {
    askedForElements[i].value = "";
  }
  // change operands if they are the same
  if (ap.operands[0] === ap.operands[1]) {
    ap.operands[0]++;
    ap.operands[1]--;
    if (ap.operators[0] === OperatorEL.times) {
      ap.result = ap.operands[0] * ap.operands[1];
    }
  }
  // fill in all operands
  document.querySelector("#op>div.eq1>span.operand1").innerHTML = ap.operands[0]; 
  document.querySelector("#op>div.eq1>span.operand2").innerHTML = ap.operands[1]; 
  document.querySelector("#op>div.eq2>span.operand1").innerHTML = ap.operands[1]; 
  document.querySelector("#op>div.eq2>span.operand2").innerHTML = ap.operands[0]; 
  document.querySelector("#invOp>div.eq1>span.operand1").innerHTML = ap.result; 
  document.querySelector("#invOp>div.eq1>span.operand2").innerHTML = ap.operands[0]; 
  document.querySelector("#invOp>div.eq2>span.operand1").innerHTML = ap.result; 
  document.querySelector("#invOp>div.eq2>span.operand2").innerHTML = ap.operands[1]; 
  askedForElements[0].focus();
},
/**
 * Event handler for click submit button events
 * 
 * @author Gerd Wagner
 * @param [event] e  A click event
 *
 */
handleClickSubmitButtonEvents: function (e) {
  var userInputField, answer, correctAnswer = 0, percentageCorrect,
      givenAnswers = 0,     // not provided by the learner, but by the program on request 
      correctAnswers = 0,   // previously answered correctly
      expectedAnswers = 0,  // = #problems - correctAnswers - givenAnswers
      submitButton = e.target,
      askedForElements = document.getElementsByClassName("askedFor");
  if (submitButton.innerHTML !== "?") {  // Continue button
    for (var i=0; i < askedForElements.length; i++) {
      askedForElements[i].classList.remove("correct");
      askedForElements[i].classList.remove("given");      
    } 
    submitButton.innerHTML = "?";
    oa.ctrl.continueCurrentExercise();
  } else {
    for (var i=0; i < askedForElements.length; i++) { 
      userInputField = askedForElements[i];
      if (userInputField.classList.contains("correct") ||
          userInputField.classList.contains("given")) {
        continue;
      }
      expectedAnswers++;  
      answer = userInputField.value;
      switch (i) {
        case 0: correctAnswer = oa.currentProblem.result; break;
        case 1: correctAnswer = oa.currentProblem.result; break;
        case 2: correctAnswer = oa.currentProblem.operands[1]; break;
        case 3: correctAnswer = oa.currentProblem.operands[0]; break;
      }
      if (answer === "") {
        userInputField.value = correctAnswer;
        userInputField.classList.add("given"); 
        givenAnswers++;
      } else {
        if (parseInt(answer) === correctAnswer) {
          userInputField.classList.remove("false");
          userInputField.classList.add("correct");
          correctAnswers++;
        } else {
          userInputField.classList.add("false");
          userInputField.focus();
        }
      }
    } 
    if (correctAnswers === 4) {
      oa.view.showSmilingAri();
      if (oa.attemptCounter <= 1) oa.correctAnswerCounter++;
      submitButton.innerHTML = oa.view.continueSymbol;
      submitButton.focus();
    } else if (correctAnswers + givenAnswers === expectedAnswers) {
      if (correctAnswers > givenAnswers) oa.view.showSmilingAri();
      else oa.view.showWorriedAri();
      submitButton.innerHTML = oa.view.continueSymbol;
      submitButton.focus();
    } else { 
      oa.attemptCounter += 1;
      oa.view.showDisappointedAri();      
    }
    percentageCorrect = (oa.learningUnitProblemCounter <= 0) ? 0 : 
        Math.floor( oa.correctAnswerCounter / oa.learningUnitProblemCounter * 100);
    oa.view.showPercentageCorrect( percentageCorrect);
  }
}
};